<form class="appForm" action="<?=CONTEXT_PATH?>/admin/role/modifyUserRole" method="post">
	<div class="easyui-panel appContainer" data-options="border:false,fit:true">
		<input name="userIds" type="hidden"/>
		<input name="roleIds" type="hidden"/>
		<table style="width:100%;height:340px;">
			<tr>
				<td style="width:45%;">
					<div id="allRoleList" class="easyui-datalist" data-options="
						idField:'id',
						title:'所有角色',
						url: '<?=CONTEXT_PATH?>/admin/role/all'
						">
					</div>
				</td>
				<td>
					<a id="authRoleBt" href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon icon-direct-right'" style="padding:5px 0px;width:100%;">
					</a>
					<br/>
					<br/>
					<a id="removeRoleBt" href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon icon-direct-left'" style="padding:5px 0px;width:100%;">
					</a>
				</td>
				<td style="width:45%;">
					<div id="useRoleList" class="easyui-datalist" data-options="
						idField:'id',
						title:'已授权的角色',
						queryParams:{'user_id':'<?=$_GET['uid']?>'},
						url: '<?=CONTEXT_PATH?>/admin/role/userRoles'">
					</div>
				</td>
			</tr>
		</table>
	</div>
</form>
<script type="text/javascript">
	$("a#authRoleBt").on("click",function(){
		var rows = $("div#allRoleList").datalist("getSelections");
		var targetList = $("div#useRoleList");
		$.each(rows,function(i,r){
			if(targetList.datalist("getRowIndex",r.id)<0){
				targetList.datalist("appendRow",r);
			}
		});
	});
	$("a#removeRoleBt").on("click",function(){
		var targetList =  $("div#useRoleList");
		var rows;
		while((rows=targetList.datalist("getSelections")).length>0){
			targetList.datalist("deleteRow",targetList.datalist("getRowIndex",rows[0].id));
		}
	});
</script>